<template>
  <div>
    <!-- 导航栏 -->
    <van-nav-bar
      title="收款详情"
      left-arrow
      :border="false"
      fixed
      @click-left="$utils.back($route.path)"
    />
    <div class="has-top" />

    <van-cell>
      <div slot="title" class="flex flex-v-c">
        <svg-icon icon-class="money" class="fs-40 mr-10" />
        <span slot="title">交易金额</span>
      </div>
      <span slot="default" class="color-dark">
        {{
        cashierDetail.TransactionAmount >= 0
        ? '+ ¥' + parseFloat(cashierDetail.TransactionAmount).toFixed(2)
        : '- ¥' + parseFloat(cashierDetail.TransactionAmount).toFixed(2)
        }}
      </span>
    </van-cell>

    <van-cell-group title="交易详情">
      <van-cell title="订单号" :value="cashierDetail.Sn" />
      <van-cell title="创建时间" :value="cashierDetail.OrderTime" />
      <van-cell title="支付类型" :value="cashierDetail.PayWayName" />
      <van-cell
        title="交易说明"
        :value="
          cashierDetail.TransactionExplain
            ? cashierDetail.TransactionExplain
            : cashierDetail.TransactionAmount >= 0
            ? '收入' + cashierDetail.TransactionAmount + '元'
            : '支出' + cashierDetail.TransactionAmount + '元'
        "
      />
      <van-cell title="订单备注" :value="cashierDetail.Remark" />
    </van-cell-group>
  </div>
</template>

<script>
import { GetCashierDetail } from 'api/order'

export default {
  data() {
    return {
      cashierDetail: {}
    }
  },
  created() {
    // 获取收银详情
    this.GetCashierDetail()
  },
  methods: {
    // 获取收银详情
    GetCashierDetail() {
      GetCashierDetail(this.$route.params.id).then(res => {
        console.log(res)
        if (res) {
          this.cashierDetail = res.Data
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped></style>
